<template>
   <div>
	   <!-- 日常工作 -->
	   <div class="top">
           <div class="title">
                <img src="../../../../assets/imgs/processManagement/work1.png" alt="">小游戏          
           </div>
           <div class="content">
                <div class="contentImg">
                    <ul>
                        <li v-for="(item,index) in daily" :key="index">
                            <a  @click="routers(item.urls)">
                                <img style="border-radius:10px" :src=item.src>
                            </a>  
                            <div style="margin-top:10px">{{item.title}}</div>
                        </li>
                    </ul>
                </div>
           </div>
       </div>
   </div>
</template>
<script>
	export default {
		data() {
			return {
				// 日常工作数据
                daily: [
                    {src:require("@/assets/imgs/games/gtm.png"),title:"刮腿毛",urls:"/http://www.wesane.com/game/264/"},
                    {src:require("@/assets/imgs/games/jfcz.png"),title:"见缝插针",urls:"/http://play.ziyuantun.com/jfcz/index.html"},
                    {src:require("@/assets/imgs/games/cyc.png"),title:"擦一擦",urls:"/http://www.wesane.com/game/219/"},
                    {src:require("@/assets/imgs/games/dpp.png"),title:"打泡泡",urls:"/http://www.wesane.com/Public/Games/326029/201512100736543705/html5/index.html"},
                    {src:require("@/assets/imgs/games/jfcc.png"),title:"见缝插车",urls:"/http://t.cn/A6Py5a3Q"},
                    {src:require("@/assets/imgs/games/nddsc.png"),title:"能打多少次",urls:"/http://game3.baifumeiba.com/minigame/dddsc/"},
                    {src:require("@/assets/imgs/games/ddzk.png"),title:"打掉砖块",urls:"/http://game3.baifumeiba.com/ddzk/"},
                    {src:require("@/assets/imgs/games/wjjh.png"),title:"无尽江湖",urls:"/http://ggg.gaofushuaiba.cn/minigame/endlesslake/"},
                    {src:require("@/assets/imgs/games/syfk.png"),title:"蛇与方块",urls:"/http://ggg.gaofushuaiba.cn/minigame/svb/"},
                    {src:require("@/assets/imgs/games/gq.png"),title:"滚球",urls:"/http://game2.baifumeiba.com/minigame/ydygdy/"},
                    {src:require("@/assets/imgs/games/ymq.png"),title:"羽毛球",urls:"/http://t.cn/A6Pyti4P"},
                    {src:require("@/assets/imgs/games/wyhs.png"),title:"乌鸦喝水",urls:"/http://t.cn/RUMpO5R"},
                    {src:require("@/assets/imgs/games/6jpp.png"),title:"六角拼拼",urls:"/http://t.cn/Rtp4QDz"},
                    {src:require("@/assets/imgs/games/bn.png"),title:"捕鸟",urls:"/http://t.cn/RagxdQ0"},
                    {src:require("@/assets/imgs/games/tq.png"),title:"弹球",urls:"/http://t.cn/RVbx3Dz"},
                    {src:require("@/assets/imgs/games/qsg.png"),title:"切水果",urls:"/http://t.cn/A6PGSCKb"},
                    {src:require("@/assets/imgs/games/car2.png"),title:"汽车华容道",urls:"/http://t.cn/Ea80aIc"},
                    {src:require("@/assets/imgs/games/mjxd.png"),title:"母鸡下蛋",urls:"/http://www.wesane.com/game/705/"},
                    {src:require("@/assets/imgs/games/car.png"),title:"车水马龙",urls:"/http://www.wesane.com/game/684/"},
                    {src:require("@/assets/imgs/games/zp.png"),title:"纸牌对对碰",urls:"/http://www.wesane.com/game/701/"},
                    {src:require("@/assets/imgs/games/dlcqj.png"),title:"大力出奇迹",urls:"/http://www.wesane.com/game/726/"},
                    {src:require("@/assets/imgs/games/zp1.png"),title:"双色接龙",urls:"/http://www.wesane.com/game/680/"},
                    {src:require("@/assets/imgs/games/cnhk.png"),title:"春暖花开",urls:"/http://www.wesane.com/game/641/"},
                    {src:require("@/assets/imgs/games/mhqx.png"),title:"满汉全席",urls:"/http://www.wesane.com/game/635/"},
                    {src:require("@/assets/imgs/games/hcdxg.png"),title:"合成大西瓜",urls:"/http://www.wesane.com/game/654/"},
                    {src:require("@/assets/imgs/games/sgdw.png"),title:"水果大王",urls:"/http://www.wesane.com/game/694/"},
                    {src:require("@/assets/imgs/games/car1.png"),title:"按序停车",urls:"/http://www.wesane.com/game/649/"},
                    {src:require("@/assets/imgs/games/gxfc.png"),title:"恭喜发财",urls:"/http://www.wesane.com/game/640/"},
                    {src:require("@/assets/imgs/games/jhsz.png"),title:"交换数字",urls:"/http://www.wesane.com/game/735/"},
                    {src:require("@/assets/imgs/games/jbs.png"),title:"接杯水",urls:"/http://www.wesane.com/game/669/"},
                    {src:require("@/assets/imgs/games/znm.png"),title:"找你妹",urls:"/http://www.wesane.com/game/123/"},

                    {src:require("@/assets/imgs/games/hjkg.png"),title:"黄金矿工",urls:"/http://www.wesane.com/Public/Games/326029/201708030600458734/html5/index.html?gameID=226232"},
                    {src:require("@/assets/imgs/games/wzq.png"),title:"五子棋",urls:"/http://www.wesane.com/game/27/"},
                    {src:require("@/assets/imgs/games/ai.png"),title:"找不同",urls:"/http://www.wesane.com/Public/Games/326029/201612010520022577/html5/index.html?gameID=226170"},
                    {src:require("@/assets/imgs/games/zi.png"),title:"填成语",urls:"/http://www.wesane.com/Public/Games/326029/201609210432031111/html5/index.html?gameID=226147"},
                    {src:require("@/assets/imgs/games/tcs.png"),title:"贪吃蛇",urls:"/http://www.wesane.com/Public/Games/326029/201708090942432222/html5/index.html?gameID=226233"},
                    {src:require("@/assets/imgs/games/sl.png"),title:"扫雷",urls:"/http://www.wesane.com/Public/Games/326029/201708170456562087/html5/index.html?gameID=226239"},
                    {src:require("@/assets/imgs/games/fcxyz.png"),title:"孵出小鸭子",urls:"/http://www.wesane.com/game/734/"},
                    {src:require("@/assets/imgs/games/21.png"),title:"21",urls:"/http://www.wesane.com/game/548/"},
                ],
			}
		},
		methods:{
			routers(urls){
                console.log(urls);
                this.$router.push(urls);
            }
		},
	}
</script>
<style scoped>
*{
    margin:0;
    padding:0;
}
/* 四大模块 */
.top,.middle_top,.middle_bottom,.bottom {
    width: 100%;
    background-color: white;
}
/* 所有标题样式 */
.title{
    width: 100%;
    height: 25px;
    background-color: rgb(238, 238, 238);
    display: flex;
    flex-direction: row;
    font-size: 13px;
    align-items: center;
    color: #1081a3;
}
/* 标题前小图,标题*/
.title img {
    width: 15px;
    height: 15px;
    margin: 5px 5px;
}

/* 内容样式 */
.content{
    font-size:12px;
    text-align: center;
    width: 100%;
    background: rgba(255, 255, 255, 0.2);
}
.content .contentImg{
    width: 100%;
    text-align: center;
    margin: 0 auto;
}

.content ul {
    display: flex;
    flex-wrap: wrap;
}

/* 第一行 */
.content li {
    list-style-type: none;
    display: inline-block;
    width: 8.3%;
    padding: 20px 0;
}
/* 第二行 为了去除上内边 */
 .contentImg_second li{
    padding:0 0 20px 0;
 }
/* 图片样式 */
.content li img {
    width: 65px;
    height: 65px;
    -webkit-transition: all 0.3s;
    -webkit-transform-origin: 40% 70%;
}
/* 图片悬浮样式 */
.content li:hover img {
    -webkit-transform: scale(1.4);
}
</style>